<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .div_top{
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
        }
        .anjian{
            position: absolute;
            left: 30%;
        }
    </style>
</head>
<body>
<div id="app" >
    <div class="div_top">
        <h1 style="margin-left: 40px">奇准CRM客户管理系统</h1>
        <el-input v-model="input.name" placeholder="请输入内容" style="margin-bottom: 20px"></el-input>
        <el-input placeholder="请输入密码" v-model="input.number" show-password></el-input><br><br>
        <div class="anjian">
            <el-button @click="submitForm()" type="primary" round>登录</el-button>
            <el-button type="success" round>取消</el-button>
        </div>

    </div>
</div>

<script src="js/axios-0.18.0.js"></script>
<script src="js/vue.js"></script>
<script src="element-ui/lib/index.js"></script>
<link rel="stylesheet" href="element-ui/lib/theme-chalk/index.css">

<script>
    new Vue({
        el: "#app",
        data(){
            return {
                input:{
                    name:"",
                    number: ""
                }
            }
        },
        methods:{
            submitForm(){           //登录按钮方法
                // 发送ajax请求，添加
                var _this = this;
                axios({
                    method:"post",
                    url:'login',    //请求完整路径：http://localhost:8080/brand_zong_he_war/login
                    data:_this.input            //携带的信息
                }).then(function (resp) {   //请求发送成功就执行
                    // 判断响应数据是否为 success
                    if(resp.data == "success"){//
                        window.location.href = "brandss.html";//跳转到
                    }else {
                        this.$message.error('用户名或密码错误');
                    }
                })
                window.location.href = "brandss.html";//跳转到
                console.log(_this = this);
            }
        }
    })
</script>
</body>
</html>